<%@ page import="java.util.Map" %>
<%@ page import="java.util.List" %>
<%@ page import="com.htdz.entity.Resource" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@page isELIgnored="false" %>
<%
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>

<style type="text/css">
    html {
        -ms-text-size-adjust: 100%;
        -webkit-text-size-adjust: 100%;
    }

    body {
        font-family: 'Microsoft Yahei', '微软雅黑', '宋体', \5b8b\4f53, Tahoma, Arial, Helvetica, STHeiti;
        margin: 0;
    }

    .main-nav {
        margin-left: 1px;
    }

    .main-nav.nav-tabs.nav-stacked > li {
    }

    .main-nav.nav-tabs.nav-stacked > li > a {
        padding: 10px 8px;
        font-size: 12px;
        font-weight: 600;
        color: #4A515B;
        background: #E9E9E9;
        background: -moz-linear-gradient(top, #FAFAFA 0%, #E9E9E9 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FAFAFA), color-stop(100%,#E9E9E9));
        background: -webkit-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
        background: -o-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
        background: -ms-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
        background: linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9');
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9')";
        border: 1px solid #D5D5D5;
        border-radius: 4px;
    }

    .main-nav.nav-tabs.nav-stacked > li > a > span {
        color: #4A515B;
    }

    .main-nav.nav-tabs.nav-stacked > li.active > a, #main-nav.nav-tabs.nav-stacked > li > a:hover {
        color: #FFF;
        background: #3C4049;
        background: -moz-linear-gradient(top, #4A515B 0%, #3C4049 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4A515B), color-stop(100%,#3C4049));
        background: -webkit-linear-gradient(top, #4A515B 0%,#3C4049 100%);
        background: -o-linear-gradient(top, #4A515B 0%,#3C4049 100%);
        background: -ms-linear-gradient(top, #4A515B 0%,#3C4049 100%);
        background: linear-gradient(top, #4A515B 0%,#3C4049 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4A515B', endColorstr='#3C4049');
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#4A515B', endColorstr='#3C4049')";
        border-color: #2B2E33;
    }

    #main-nav.nav-tabs.nav-stacked > li.active > a, #main-nav.nav-tabs.nav-stacked > li > a:hover > span {
        color: #FFF;
    }

    .main-nav.nav-tabs.nav-stacked > li {
        margin-bottom: 4px;
    }

    .nav-header.collapsed > span.glyphicon-chevron-toggle:before {
        content: "\e114";
    }

    .nav-header > span.glyphicon-chevron-toggle:before {
        content: "\e113";
    }

    footer.duomi-page-footer {
        background-color: white;
    }

    footer.duomi-page-footer .beta-message {
        color: #a4a4a4;
    }

    footer.duomi-page-footer .beta-message a {
        color: #53a2e4;
    }

    footer.duomi-page-footer .list-inline a, footer.authenticated-footer .list-inline li {
        color: #a4a4a4;
        padding-bottom: 30px;
    }




    footer.duomi-page-footer {
        background-color: white;
    }

    footer.duomi-page-footer .beta-message {
        color: #a4a4a4;
    }

    footer.duomi-page-footer .beta-message a {
        color: #53a2e4;
    }

    footer.duomi-page-footer .list-inline a, footer.authenticated-footer .list-inline li {
        color: #a4a4a4;
        padding-bottom: 30px;
    }

    /*********************************************自定义部分*********************************************/
    .secondmenu a {
        font-size: 12px;
        color: #4A515B;
        text-align: center;
        border-radius: 4px;
    }

    .secondmenu > li > a:hover {
        background-color: #6f7782;
        border-color: #428bca;
        color: #fff;
    }

    .secondmenu li.active {
        background-color: #6f7782;
        border-color: #428bca;
        border-radius: 4px;
    }

    .secondmenu li.active > a {
        color: #ffffff;
    }

    .navbar-static-top {
        background-color: #212121;
        margin-bottom: 5px;
    }

    .navbar-brand {
        display: inline-block;
        vertical-align: middle;
        padding-left: 50px;
        color: #fff;
    }

    .navbar-brand:hover {
        color: #fff;
    }


    .collapse.glyphicon-chevron-toggle, .glyphicon-chevron-toggle:before {
        content: "\e113";
    }

    .collapsed.glyphicon-chevron-toggle:before {
        content: "\e114";
    }

</style>
<div id ="leftViewframeContainer" class="sidebar">
    <div class="container-fluid">
        <div class="row">
            <div >
                <ul id="main-nav" class="main-nav nav nav-tabs nav-stacked" style="">

                    <%
                        Map menuMap = (Map)request.getSession().getAttribute("menuMap");
                        List<Resource> resourceTopList = (List)menuMap.get("resourceTopList");
                        List<Resource> resourceSecondList = (List)menuMap.get("resourceSecondList");
                        for(Resource resourceTop: resourceTopList){
                    %>
                    <li>
                        <a href="#systemSetting<%=resourceTop.getResourceId()%>" class="nav-header collapsed" data-toggle="collapse" id="top-<%=resourceTop.getResourceId()%>">
                            <i class="glyphicon glyphicon-cog"></i>
                            <%=resourceTop.getResourceName()%>
                            <span class="pull-right glyphicon glyphicon-chevron-toggle"></span>
                        </a>
                        <ul id="systemSetting<%=resourceTop.getResourceId()%>" class="nav nav-list secondmenu collapse" style="height: 0px;">
                            <% for(Resource resourceSecond: resourceSecondList){
                                if(resourceTop.getResourceId() == resourceSecond.getParentId()){
                            %>
                            <li id="resource<%=resourceSecond.getResourceId()%>">
                                <a href="<%=basePath + resourceSecond.getResourceUrl()%>?baseResourceId=<%=resourceTop.getResourceId()%>-<%=resourceSecond.getResourceId()%>">
                                    <i class="<%=resourceSecond.getIcon()%>"></i>&nbsp;<%=resourceSecond.getResourceName()%></a>
                            </li>
                            <%}} %>
                        </ul>
                    </li>
                    <%}%>
                </ul>
            </div>
        </div>
    </div>
</div>
<script>
    var currentResourceId = '${sessionScope.currentResourceId}';
    var currentTopResourceId = '${sessionScope.currentTopResourceId}';
    $("#resource"+currentResourceId).attr("class","active");
    $("#top-"+currentTopResourceId).trigger("click");
</script>

